$(function () {
    var self = $(this);

    var sex_chart_b = $('#sex-chart');
    var local_chart_b = $('#local-chart');

    var male = sex_chart_b.attr('data-male');
    var female = sex_chart_b.attr('data-female');
    var str = local_chart_b.attr('data-local');
    var local_data = eval(str);

    if (male || female) {
        var sex_chart = echarts.init(document.getElementById('sex-chart'));
        var option = {
            title: {
                text: '微信好友性别比例',
                subtext: '真实数据',
                x: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data: ['男性', '女性']
            },
            toolbox: {
                show: true,
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    magicType: {
                        show: true,
                        type: ['pie', 'funnel'],
                        option: {
                            funnel: {
                                x: '25%',
                                width: '50%',
                                funnelAlign: 'left',
                                max: 1548
                            }
                        }
                    },
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            calculable: true,
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '60%'],
                    data: [
                        {value: male, name: '男性'},
                        {value: female, name: '女性'}
                    ]
                }
            ]
        };
        sex_chart.setOption(option);
    }

    if (local_data) {
        var local_chart = echarts.init(document.getElementById('local-chart'));
        var local_option = {
            title: {
                text: '微信好友全国分布图',
                subtext: '真实数据',
                x: 'center'
            },
            tooltip: {
                trigger: 'item'
            },
            legend: {
                orient: 'vertical',
                x: 'left',
                data: ['好友数量']
            },
            dataRange: {
                min: 0,
                max: 100,
                x: 'left',
                y: 'bottom',
                text: ['高', '低'],           // 文本，默认为数值文本
                calculable: true
            },
            toolbox: {
                show: true,
                orient: 'vertical',
                x: 'right',
                y: 'center',
                feature: {
                    mark: {show: true},
                    dataView: {show: true, readOnly: false},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            roamController: {
                show: true,
                x: 'right',
                mapTypeControl: {
                    'china': true
                }
            },
            series: [
                {
                    name: '好友数量',
                    type: 'map',
                    mapType: 'china',
                    roam: false,
                    itemStyle: {
                        normal: {label: {show: true}},
                        emphasis: {label: {show: true}}
                    },
                    data: local_data
                }
            ]
        };
        local_chart.setOption(local_option);
    }
});